<html lang="en">
	<head>
		<meta charset="UTF-8">
		<title>Document</title>
		<meta name="viewport" content="width=device-width,initial-scale=1">
		<link rel="stylesheet" href="css/bootstrap.css">
		<script src="js/jquery.min.js"></script>
		<script src="js/popper.min.js"></script>
		<script src="js/bootstrap.min.js"></script>
	    <link rel="stylesheet" href="css/comm.css">
	    <link rel="stylesheet" href="css/list.css">
	</head>
	<body>
		<!-- 头部 -->
		<div>
			<iframe src="header.html" class="my_header" scrolling="no"></iframe>
		</div>
		<div class="container">
			<!-- 顶部的banner -->
			<div class="my-3">
				<img class="w-100" src="img/index/index_guild.png" alt="">
			</div>
			<!-- 中部 -->
			<div class="row ">
				<!-- 中部左边 -->
				<div class="col-md-9 col-sm-12">
					<div class="my-grey w-100">
						<p class="h5 ml-5 text-muted">笔记本电脑</p>
					</div>
					<div class="row bg-white mx-0 pt-4 pb-0">
						<!-- 1 -->
						<div class="col-sm-12 col-md-6 col-lg-4 col-xl-3 py-2">
							<div class="card">
								<a href="#">
									<img class="w-100"src="http://101.96.128.94:9999/img/product/md/57b12a31N8f4f75a3.jpg" alt="">
								</a>
								<p class="h5 font-weight-bold text-primary">￥6988.00</p>
								<a href="#" class="text_small text-muted">Apple MacBook Air 13.3英寸笔记本 银色(Core i5 处理器/8GB内存/128GB SSD闪存 MMGF2CH/A)</a>
								<div class="d-flex justify-content-around align-items-center">
									<button class="btn my-btn">-</button>
									<input class="my-input" value="1"type="text">
									<button class=" btn my-btn ">+</button>
									<a href="">
										<button class="btn btn-primary btn-sm">加入购物车</button>
									</a>
								</div>
							</div>
						</div>
						<!-- 2 -->
						<div class="col-sm-12 col-md-6 col-lg-4 col-xl-3  py-2 ">
							<div class="card">
								<a href="#">
									<img class="w-100"src="http://101.96.128.94:9999/img/product/md/57b12a31N8f4f75a3.jpg" alt="">
								</a>
								<p class="h5 font-weight-bold text-primary">￥6988.00</p>
								<a href="#" class="text_small text-muted">Apple MacBook Air 13.3英寸笔记本 银色(Core i5 处理器/8GB内存/128GB SSD闪存 MMGF2CH/A)</a>
								<div class="d-flex justify-content-around align-items-center">
									<button class="btn my-btn">-</button>
									<input class="my-input" value="1"type="text">
									<button class=" btn my-btn ">+</button>
									<a href="">
										<button class="btn btn-primary btn-sm">加入购物车</button>
									</a>
								</div>
							</div>
						</div>
						<!-- 3 -->
						<div class="col-sm-12 col-md-6 col-lg-4 col-xl-3  py-2">
							<div class="card">
								<a href="#">
									<img class="w-100"src="http://101.96.128.94:9999/img/product/md/57b12a31N8f4f75a3.jpg" alt="">
								</a>
								<p class="h5 font-weight-bold text-primary">￥6988.00</p>
								<a href="#" class="text_small text-muted">Apple MacBook Air 13.3英寸笔记本 银色(Core i5 处理器/8GB内存/128GB SSD闪存 MMGF2CH/A)</a>
								<div class="d-flex justify-content-around align-items-center">
									<button class="btn my-btn">-</button>
									<input class="my-input" value="1"type="text">
									<button class=" btn my-btn ">+</button>
									<a href="">
										<button class="btn btn-primary btn-sm">加入购物车</button>
									</a>
								</div>
							</div>
						</div>
						<!-- 4-->
						<div class="col-sm-12 col-md-6 col-lg-4 col-xl-3  py-2">
							<div class="card">
								<a href="#">
									<img class="w-100"src="http://101.96.128.94:9999/img/product/md/57b12a31N8f4f75a3.jpg" alt="">
								</a>
								<p class="h5 font-weight-bold text-primary">￥6988.00</p>
								<a href="#" class="text_small text-muted">Apple MacBook Air 13.3英寸笔记本 银色(Core i5 处理器/8GB内存/128GB SSD闪存 MMGF2CH/A)</a>
								<div class="d-flex justify-content-around align-items-center">
									<button class="btn my-btn">-</button>
									<input class="my-input" value="1"type="text">
									<button class=" btn my-btn ">+</button>
									<a href="">
										<button class="btn btn-primary btn-sm">加入购物车</button>
									</a>
								</div>
							</div>
						</div>
						<!-- 5 -->
						<div class="col-sm-12 col-md-6 col-lg-4 col-xl-3  py-2">
							<div class="card">
								<a href="#">
									<img class="w-100"src="http://101.96.128.94:9999/img/product/md/57b12a31N8f4f75a3.jpg" alt="">
								</a>
								<p class="h5 font-weight-bold text-primary">￥6988.00</p>
								<a href="#" class="text_small text-muted">Apple MacBook Air 13.3英寸笔记本 银色(Core i5 处理器/8GB内存/128GB SSD闪存 MMGF2CH/A)</a>
								<div class="d-flex justify-content-around align-items-center">
									<button class="btn my-btn">-</button>
									<input class="my-input" value="1"type="text">
									<button class=" btn my-btn ">+</button>
									<a href="">
										<button class="btn btn-primary btn-sm">加入购物车</button>
									</a>
								</div>
							</div>
						</div>
						<!-- 6 -->
						<div class="col-sm-12 col-md-6 col-lg-4 col-xl-3  py-2">
							<div class="card">
								<a href="#">
									<img class="w-100"src="http://101.96.128.94:9999/img/product/md/57b12a31N8f4f75a3.jpg" alt="">
								</a>
								<p class="h5 font-weight-bold text-primary">￥6988.00</p>
								<a href="#" class="text_small text-muted">Apple MacBook Air 13.3英寸笔记本 银色(Core i5 处理器/8GB内存/128GB SSD闪存 MMGF2CH/A)</a>
								<div class="d-flex justify-content-around align-items-center">
									<button class="btn my-btn">-</button>
									<input class="my-input" value="1"type="text">
									<button class=" btn my-btn ">+</button>
									<a href="">
										<button class="btn btn-primary btn-sm">加入购物车</button>
									</a>
								</div>
							</div>
						</div>
						<!-- 7 -->
					<div class="col-sm-12 col-md-6 col-lg-4 col-xl-3  py-2">
						<div class="card">
							<a href="#">
								<img class="w-100"src="http://101.96.128.94:9999/img/product/md/57b12a31N8f4f75a3.jpg" alt="">
							</a>
							<p class="h5 font-weight-bold text-primary">￥6988.00</p>
							<a href="#" class="text_small text-muted">Apple MacBook Air 13.3英寸笔记本 银色(Core i5 处理器/8GB内存/128GB SSD闪存 MMGF2CH/A)</a>
							<div class="d-flex justify-content-around align-items-center">
								<button class="btn my-btn">-</button>
								<input class="my-input" value="1"type="text">
								<button class=" btn my-btn ">+</button>
								<a href="">
									<button class="btn btn-primary btn-sm">加入购物车</button>
								</a>
							</div>
						</div>
					</div>
						<!-- 8 -->
						<div class="col-sm-12 col-md-6 col-lg-4 col-xl-3  py-2">
							<div class="card">
								<a href="#">
									<img class="w-100"src="http://101.96.128.94:9999/img/product/md/57b12a31N8f4f75a3.jpg" alt="">
								</a>
								<p class="h5 font-weight-bold text-primary">￥6988.00</p>
								<a href="#" class="text_small text-muted">Apple MacBook Air 13.3英寸笔记本 银色(Core i5 处理器/8GB内存/128GB SSD闪存 MMGF2CH/A)</a>
								<div class="d-flex justify-content-around align-items-center">
									<button class="btn my-btn">-</button>
									<input class="my-input" value="1"type="text">
									<button class=" btn my-btn ">+</button>
									<a href="">
										<button class="btn btn-primary btn-sm">加入购物车</button>
									</a>
								</div>
							</div>
						</div>
					<!-- 分页查询 -->
					<ul class="pagination my-grey align-items-center w-100 justify-content-end mb-0">
						<li class="page-item  disabled">
							<a class="page-link"href="">上一页</a>
						</li>
						<li class="page-item active">
							<a class="page-link  "href="">1</a>
						</li>
						<li class="page-item">
							<a class="page-link "href="">2</a>
						</li>
						<li class="page-item">
							<a class="page-link "href="">3</a>
						</li>
						<li class="page-item">
							<a class="page-link "href="">4</a>
						</li>
						<li class="page-item">
							<a class="page-link "href="">5</a>
						</li>
						<li class="page-item">
							<a class="page-link mr-0 "href="">下一页</a>
						</li>
						
					</ul>
				
				</div>
					
				<!-- 中部右边 -->
				
				
			</div>
			<div class="col-md-3 col-sm-12">
				<!-- 商家公告 -->
				<div class="w-100">
					<div class="my-grey pl-3 ">
						<img src="http://101.96.128.94:9999/img/foodstore/foodstore_icon2.png" alt="">
						<span class="text-muted ">商家公告</span>
					</div>
					<div class=" bg-white p-3">
						<p class="text_small text-muted ">本店推出全网最低价套餐，保证比其他平台的价格要低！
						</p>				
						<p class="text_small text-muted ">不要葱、姜、蒜等这些忌口暂时无法坐不了，敬请谅解！					   </p>				 
						<p class="text_small text-muted ">
						晚上10点以后订餐需另加送餐费2元！谢谢合作
						</p>
					</div>
					<ul class="list-group">
						<li class="list-group-item d-flex justify-content-between bg-transparent">
							<span class=" text-muted ">
								购物车
							</span>
							<a href="#" class=" text-muted ">
								清空
							</a>
						</li>
						<li class=" my-shopping  list-group-item d-flex justify-content-around">
							<span class="w-75 text-truncate text_small text-muted">
								Apple MacBook Air 13.3英寸笔记本 银色(Core i5 处理器/8GB内存/128GB SSD闪存 MMGF2CH/A)
							</span>
							<div class="d-flex justify-content-around align-items-center">
								<button class="btn my-btn">-</button>
								<input class="my-input" value="1"type="text">
								<button class=" btn my-btn ">+</button>
								<span class="text_small text-muted">￥9999.99</span>
								
							</div>
							
						</li>
						<li class="list-group-item my-shopping d-flex justify-content-around">
							<span class="w-75 text-truncate text_small text-muted">
								Apple MacBook Air 13.3英寸笔记本 银色(Core i5 处理器/8GB内存/128GB SSD闪存 MMGF2CH/A)
							</span>
							<div class="d-flex justify-content-around align-items-center">
								<button class="btn my-btn">-</button>
								<input class="my-input" value="1"type="text">
								<button class=" btn my-btn ">+</button>
								<span class="text_small text-muted">￥9999.99</span>
								
							</div>
							
						</li>
						<li class="list-group-item d-flex bg-secondary p-0 justify-content-between align-items-center">
							<div class="ml-4">
								<img src="img/foodstore/foodstore_car_2.png" alt="">
								<span class="text-white">￥:111119.00</span>
							</div>
							<button class="btn btn-primary rounded-0">去结算</button>
							
						</li>
					</ul>
				</div>
			</div>
					
			
		</div>
	</div>
		<!-- 尾部 -->
		<div >
			<iframe src="footer.html" class="my_footer" scrolling="no"></iframe>
		</div>
	</body>
</html>
